CSS 梯度
阐述
线性梯度 linear-gradient
指定方向和一系列颜色。方向可以是角度（默认为 180deg，从上到下）， 也可以是 to right 这样的关键词。颜色后面可以跟一个可选的百分比，用于控制颜色过渡的位置。另外，我们可以在两个颜色之间插入梯度指示，表明两个颜色的中间色应该在坐标过渡的哪个位置。
径向梯度 radial-gradient
具有类似的语法，但是第一个参数可以是：
- 两个百分比：指定梯度的「核」应该占据多少横向和纵向空间
circle at <percentage> <percentage>：以某个点为中心
锥形梯度 conic-gradient
具有类似的语法，但第一个参数的形式是 from <angle> at <position>，其中 <position> 可以是两个百分比或关键字。
实例
用径向梯度制造一个日落效果：
.box {
width: 200px;
height: 200px;
border: 3px solid;
background-image: radial-gradient(
circle at 50% 100%,
white 0%,
yellow 10%,
gold 20%,
coral 30%,
skyblue
);
}